Collapse How To's

How to's for the Collapse guide.

How to Use Collapse?

How to Use Collapse?

The following steps should be followed to use the Collapse object on a form.

Add the Collapse Object to the Form

1. Open the form design screen.
2. Go to the Toolbox panel.
3. Locate the Collapse object.
4. Drag and drop the object onto the form.

Create Collapse

1. Click the Collapse object.
2. View the tab settings in the Property Viewer panel.
3. Add new tabs:
   • Define a tab name (e.g., General Information, Details, Additional Information)
4. Arrange the order of the tabs as desired.

Add Objects to Collapse

1. Activate the relevant tab.
2. Drag form objects from the Toolbox and drop them into the active tab.
3. Build the design by adding different objects for each tab.

Objects cannot be added to an inactive tab.

Switching Between Collapse

• During design, you can change the active tab by clicking on tabs
• In the web interface, users switch by clicking on tabs
• Only the objects in the active tab are displayed

Usage Examples

• Tab 1: General Information (TextBox, ComboBox)
• Tab 2: Details (DataGrid, Lookup)
• Tab 3: Additional Documents (RelatedDocuments, FileSelector)

Tips

• Choose short and descriptive tab names
• Avoid creating too many tabs
• Group logically related fields within the same tab
• Collapse can be used together with Panel or Collapse objects

Notes

• The Collapse object does not affect the form’s data structure
• Collapse are intended only for layout and user experience
• Rules and events are defined on the objects within the tabs

---

What Is Collapse?

What Is Collapse?

Collapse is a form design object used to create multiple different views (tabs) on a form, providing users with an organized and easy-to-understand interface.

Each tab represents a different section of the form, and by switching between tabs, only the objects belonging to the active tab are displayed.

This approach helps to:

• Reduce form complexity
• Logically separate related fields
• Improve the user experience

Key Features

• Each tab is an independent design area
• Navigation between tabs is supported
• Different functional areas can be created within the same form
• Different form objects can be added to each tab

Where Is It Used?

• In multi-step data entry forms
• In forms where information, details, and additional fields need to be separated
• For separating sections such as settings, details, and supplementary information
• To prevent user fatigue in long forms

Notes

• Collapse is only a layout object
• It does not store data or contain business logic
• Objects added to it are visible based on the active tab

---

How to Use Client Enabled?

What is Client Enabled?

Client Enabled is a property that defines whether a form control is active (enabled) on the client side when the form is first loaded.
If it is set to True, the control is immediately usable by the user.
If it is set to False, the control is disabled and cannot be interacted with until a specific condition or rule activates it.

This property is especially useful for controlling the user’s interaction flow and applying dynamic behaviors using the Rule Manager.

What Does It Do?

The property allows developers to:

• Control when a form control becomes interactive.
• Prevent users from entering or changing data until prerequisites are met.
• Dynamically enable or disable controls based on user input or logic.

Example Scenario — Conditional Activation

Scenario:
A form contains a checkbox called “I Accept Terms” and a text field called “Signature.”
The goal is to make the “Signature” field inactive until the user checks “I Accept Terms.”

Steps to Implement:

1. Select the “Signature” field in the form editor.

2. In the Properties panel, find the Client Enabled field.

3. Set the value to False — the field will now be disabled by default when the form loads.

4. Open the Rule Manager.

5. Add a new rule:

   Condition:

Action:

6. Save and publish the form.

Result:

• When the form loads, the “Signature” field is disabled.
• Once the user checks “I Accept Terms,” the field automatically becomes active and editable.

Behavior Summary

Property State	Description
True	The control is active and ready for user interaction when the form loads.
False	The control is disabled at load time and can be enabled dynamically via rules or code.

Notes & Best Practices

• Use the Client Enabled property to manage client-side interactivity without requiring server actions.
• Combine it with Rule Manager to define when and how controls become active.
• Remember: if server enablement is disabled, the client cannot enable the control even if Client Enabled is set to True.
• By default, this property is set to True (active).

Summary

Client Enabled improves form usability by letting developers control when and how users interact with form controls.
It is essential for creating responsive, condition-based form experiences where user actions dynamically change the form’s state.

---

What Is Collapse?

What Is Collapse?

Collapse is a form component used to group multiple form objects under a single header and allow this area to be collapsed (hidden) or expanded (shown) by the user when needed.

With this component:

• Forms look cleaner and more organized
• Complex or secondary sections can be hidden
• Overall user experience (UX) is improved

The Collapse component is especially preferred for long forms, optional fields, and managing detailed information.

What Is It Used For?

• Dividing long forms into logical sections
• Hiding optional or advanced information
• Preventing users from being overwhelmed by unnecessary details
• Providing a clean layout in both mobile and web interfaces

Usage Examples

• “Detail Information” section
• “Additional Settings” panel
• “Advanced Options”
• “Descriptions / Notes”

Notes

• Collapse provides visual grouping only and does not affect data behavior.
• Various form components can be placed inside it (TextBox, DataGrid, ComboBox, etc.).
• It can be configured to be expanded or collapsed by default.